<template>
	<view>
		<!--微信授权登录--> 
		<view class="cu-modal " :class="loadModalclk? 'show' : ''">
			<view class="cu-dialog">
				<view class="logintitle">授权登录</view>
				<view class="logoht">
					<image class="logoimg" src="../static/wechat.png"></image>
					 <u-icon name="arrow-right-double" color="#2979ff" size="28"></u-icon>
					<image class="logoimg" src="../static/logo.jpg"></image>
				</view>
				<view class="logoht"> 
					已阅读并同意
					<text class="text-green" @click="ynsxie">用户协议</text>
				</view>
				<view class="logoht">
					<view class="cu-btn bg-gray" @tap="hideModals">取消</view> 
					<button class="cu-btn bg-green" :disabled="!wechatPath.code" @tap="getUserProfile">
						{{ wechatPath.code ? '快捷登陆' : '加载中..' }}
					</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { userlogin,profile } from '@/common/api.js';
	export default {
		name:"login",
		props:{
			loadModal: {
				type: null,
				// default:'',
				requeired: true
			},
			sharid: { 
			}
		} ,
		data() {
			return {
				loadModalclk:this.loadModal,
				//微信授权登录 
				showAgree: true,
				modalName: 'wechat',
				base: '',
				isRotate: false, //按钮旋转状态
				wechatPath: {
					shareuid: '',
					platform: 'wechat',
					// code: false,
					encryptedData: '',
					iv: '',
					code: false
				},
				optiondata: '',
			};
		},
		mounted(){
		        // console.log("loadModal:"+this.loadModal) 
				// this.loadModalclk = this.loadModal
				
		}, 
		created() { 
			//微信需要需要取code拿着去服务器换资料
			// #ifdef MP-WEIXIN
			this.getCode();
			// #endif
		}, 
		watch:{ 
			loadModal(type){
			 // console.log("loadModal:"+type);
			 this.loadModalclk = this.loadModal
			}
		},
		methods: {
			ynsxie(){
				console.log(123);
				uni.navigateTo({
					url:'/staffModelA/staffB/userinfoadd/userinfoadd'
				})
			},
			hideModal() {
				this.loadModal = null; 
			},
			getUserProfile(e) {
				console.log('uni.getStorageSync',uni.getStorageSync('CurrentClient'));
				let _this = this;
				let modalName = _this.modalName;
				uni.getUserProfile({
				      desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
				      success: (e) => {
						  console.log(e.userInfo)
					/* 	uni.setStorage({
							key:'userinfo',
							data:e.userInfo
						})	 */
				      /*  if (e.errMsg != 'getUserInfo:ok') {
				        	_this.$common.errorToShow('授权失败');
				        	return;
				        }
				        */
				        // 显示等待
				        _this.loadModal = true;
				        // 获取关键内容
				        _this.wechatPath.iv = e.iv;
				        _this.wechatPath.encryptedData = e.encryptedData; 
						console.log( _this.wechatPath)
						
						// return false
						userlogin({
							 code: this.wechatPath.code,
							 pid:this.sharid,
							 /* iv:_this.wechatPath.iv,
							 encryptedData:_this.wechatPath.encryptedData */ 
							 avatar: e.userInfo.avatarUrl,
							 nickname: e.userInfo.nickName
							 
						}).then((res) => {   
						 	console.log(res.data.data)
							if(res.data.data.token){
								 this.loadModalclk=false;
								uni.setStorage({
									key:'usertoken',
									data:res.data.data.token
								});
								uni.setStorage({
									key:'userCent',
									data:res.data.data  
								});
								this.$emit("hidelogin",false)
								// _this.getuserinfo(e.userInfo.avatarUrl,e.userInfo.nickName)	
							}	
							  
							 _this.isRotate = false;
						 }).catch((err) =>{
						 	 console.log(err)
							 _this.loadModalclk=false;
							 _this.isRotate = false;
							 _this.getCode();
						 }) 
				      }
				    })
				
			
			},
			//更新用户信息
			getuserinfo(avatar,nickname){
				profile({
					avatar:avatar,
					nickname:nickname
				}).then((res) => {
					 this.loadModalclk=false;
				 }).catch((err) =>{
					 this.loadModalclk=false;
				 	 console.log(err)
					  
				 }) 
			},
			// Code凭证微信小程序登陆
			wechatMpLogin(e) {
				let _this = this;
				let modalName = _this.modalName;
			 
				if (e.detail.errMsg != 'getUserInfo:ok') { 
					uni.showToast({
						title:'授权失败',
						icon:'none'
					}) 
					return;
				} 
				// 显示等待
				_this.loadModal = true;
				// 获取关键内容
				_this.wechatPath.iv = e.detail.iv;
				_this.wechatPath.encryptedData = e.detail.encryptedData; 
				// 请求小程序登陆接口
				console.log(_this.wechatPath)
		
			},
			
			
			to(type, data) {
				_this.$common.to(type, data);
			},
			//初始化默认授权操作
			getCode() {
				uni.login({
					success: res => {
						console.log('wechatPath', res);
						if (res.code) {
							this.wechatPath.code = res.code;
						} else {
							// this.$common.errorToShow('用户未授权code');
							uni.showToast({
								title:'用户未授权code',
								icon:'none'
							})
						}
					},
					fail: res => { 
						uni.showToast({
							title:'用户授权失败',
							icon:'none'
						})
					}
				});
			},
			
			//	授权操作
/* 			getUserInfo(e) {
				console.log('e', e);
				return false;
				let name = _this.modalName;  
					_this.loadModal = true;
					if (e.detail.errMsg == 'getUserInfo:fail auth deny') { 
						uni.showToast({
							title:'未授权',
							icon:'none'
						})
						_this.loadModal = false;
					} else {
						_this.path.iv = e.detail.iv;
						_this.path.edata = e.detail.encryptedData;
					}
				 
			}, */
			
			agree() {
				this.showAgree = !this.showAgree;
			},
			hideModals() {
				console.log(this.loadModal) 
				this.loadModalclk = false; 
			    this.$emit("hidelogin",false) 
			},
			hideModals2() {
				this.loadModalmobiel = null
			},
			//授权登录结束
			
		},
	}
</script>

<style lang="less">
	.logoht{
		display: flex;
		justify-content: center; 
		flex-direction: row;
		padding:20rpx 0 40rpx 0 ;
	}
	.logoimg{
		width: 120rpx;height: 120rpx;
		margin: 0 20rpx;
		border-radius: 100%;
	}
	.logintitle{
		height: 90rpx;
		line-height: 90rpx;
		font-size: 32rpx;
	}
	.cu-modal2{
		 
		z-index: 1108!important;
	 
	}
	.cu-modal {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 1110;
		opacity: 0;
		outline: 0;
		text-align: center;
		-ms-transform: scale(1.185);
		transform: scale(1.185);
		backface-visibility: hidden;
		perspective: 2000rpx;
		background: rgba(0, 0, 0, 0.6);
		transition: all 0.3s ease-in-out 0s;
		pointer-events: none;
	}
	
	.cu-modal::before {
		// content: "\200B";
		// display: inline-block;
		// height: 100%;
		// vertical-align: middle;
	}
	
	.cu-modal.show {
		opacity: 1;
		transition-duration: 0.3s;
		-ms-transform: scale(1);
		transform: scale(1);
		overflow-x: hidden;
		overflow-y: auto;
		pointer-events: auto;
	}
	
	.cu-dialog {
		position: relative;
		display: inline-block;
		vertical-align: middle;
		margin-left: auto;
		margin-right: auto;
		top: 30%;
		width: 680rpx;
		max-width: 100%;
		background-color: #f8f8f8;
		border-radius: 10rpx;
		overflow: hidden;
	}
	
	.cu-modal.bottom-modal::before {
		vertical-align: bottom;
	}
	
	.cu-modal.bottom-modal .cu-dialog {
		width: 100%;
		border-radius: 0;
	}
	
	.cu-modal.bottom-modal {
		margin-bottom: -1000rpx;
	}
	
	.cu-modal.bottom-modal.show {
		margin-bottom: 0;
	}
	
	.cu-modal.drawer-modal {
		transform: scale(1);
		display: flex;
	}
	
	.cu-modal.drawer-modal .cu-dialog {
		height: 100%;
		min-width: 200rpx;
		border-radius: 0;
		margin: initial;
		transition-duration: 0.3s;
	}
	
	.cu-modal.drawer-modal.justify-start .cu-dialog {
		transform: translateX(-100%);
	}
	
	.cu-modal.drawer-modal.justify-end .cu-dialog {
		transform: translateX(100%);
	}
	
	.cu-modal.drawer-modal.show .cu-dialog {
		transform: translateX(0%);
	}
	.cu-modal .cu-dialog>.cu-bar:first-child .action{
	  min-width: 100rpx;
	  margin-right: 0;
	  min-height: 100rpx;
	} 

.cu-btn {
	position: relative;
	border: 0rpx;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: 0 30rpx;
	font-size: 28rpx;
	height: 64rpx;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	overflow: visible;
	margin-left: initial;
	transform: translate(0rpx, 0rpx);
	margin-right: initial;
}

.cu-btn::after {
	display: none;
}

.cu-btn:not([class*="bg-"]) {
	background-color: #f0f0f0;
}

.cu-btn[class*="line"] {
	background-color: transparent;
}

.cu-btn[class*="line"]::after {
	content: " ";
	display: block;
	width: 200%;
	height: 200%;
	position: absolute;
	top: 0;
	left: 0;
	border: 1rpx solid currentColor;
	transform: scale(0.5);
	transform-origin: 0 0;
	box-sizing: border-box;
	border-radius: 12rpx;
	z-index: 1;
	pointer-events: none;
}

.cu-btn.round[class*="line"]::after {
	border-radius: 1000rpx;
}

.cu-btn[class*="lines"]::after {
	border: 6rpx solid currentColor;
}

.cu-btn[class*="bg-"]::after {
	display: none;
}

.cu-btn.sm {
	padding: 0 20rpx;
	font-size: 20rpx;
	height: 48rpx;
}

.cu-btn.lg {
	padding: 0 40rpx;
	font-size: 32rpx;
	height: 80rpx;
}

.cu-btn.cuIcon.sm {
	width: 48rpx;
	height: 48rpx;
}

.cu-btn.cuIcon {
	width: 64rpx;
	height: 64rpx;
	border-radius: 500rpx;
	padding: 0;
}

button.cuIcon.lg {
	width: 80rpx;
	height: 80rpx;
}

.cu-btn.shadow-blur::before {
	top: 4rpx;
	left: 4rpx;
	filter: blur(6rpx);
	opacity: 0.6;
}

.cu-btn.button-hover {
	transform: translate(1rpx, 1rpx);
}

.block {
	display: block;
}

.cu-btn.block {
	display: flex;
}

.cu-btn[disabled] {
	opacity: 0.6;
	color: #ffffff;
}

.bg-green {
	background-color: #39b54a;
	color: #ffffff;
	margin: 0 40rpx;
}
.bg-gray{
	background-color: #4A90E2;
	color: #ffffff;
	border-radius:10rpx ;
	margin: 0 40rpx;
}
.text-green,
.line-green,
.lines-green {
	color: #39b54a;
}

</style>
